const findEle = (parent: any, type: string) => {
  return parent.tagName.toLowerCase() === type ? parent : parent.querySelector(type)
}

export const inputNumber = {
  mounted: (el: any) => {
    const $input = findEle(el, 'input')

    el.addEventListener('input', () => {
      if (+$input.value === 0) {
        // 首位输入0控制
        $input.value = ''
      }
      $input.value = $input.value.replace(/[^\d]/g, '')
    })
  }
}

export const input2Point = {
  mounted: (el: any) => {
    const $input = findEle(el, 'input')

    el.addEventListener('input', () => {
      // 第一步：把不是数字，不是小数点的过滤掉
      // 第二步：第一位0开头，0后面为数字，则过滤掉，取后面的数字
      // 第三步：如果输入的第一位为小数点，则替换成 0. 实现自动补全
      // 第四步：最终匹配得到结果 以数字开头，只有一个小数点，而且小数点后面只能有0到2位小数
      $input.value =
        $input.value
          .replace(/[^\d^.]+/g, '')
          .replace(/^0+(\d)/, '$1')
          .replace(/^\./, '0.')
          .match(/^\d*(\.?\d{0,2})/g)[0] || ''
    })
  }
}

export const inputThousand = {
  mounted: (el: any) => {
    const $input = findEle(el, 'input')
    el.addEventListener('input', () => {
      $input.value = $input.value
        .replace(/[^\d^.]+/g, '')
        .replace(/^0+(\d)/, '$1')
        .replace(/^\./, '0.')
        .replace(/\B(?=(\d{3})+(?!\d))/g, ',')
    })
  }
}
